import { Ref, ShallowRef } from 'vue';
import type { SpanConfig } from '@/components/query-form/hook/use-span-config.ts';

export const formContextKey = Symbol('formContextKey');

export type FormItemData = {
  uid: number;
  index: number | null;
  visible: boolean;
};

export type QueryFormProvide = {
  formItems: ShallowRef<FormItemData[]>;
  registerForm: (child: FormItemData) => void;
  unregisterForm: (uid: number) => void;
  form: Ref<SpanConfig>;
  overflow: boolean;
};

export type QueryFormItemRule = {
  type: 'input' | 'dict-select' | 'select' | 'date-picker' | 'time-picker' | 'switch' | 'checkbox' | 'checkbox-group' | 'checkbox-button' | 'radio-group' | 'radio-button' | 'input-number' | 'tree-select' | 'upload' | 'slider';
  prop: string;
  label: string;
  styles?: {
    [key: string]: number | string
  };
  clearable?: boolean;
  placeholder?: string;
  inputType?: undefined | 'text' | 'textarea' | 'password' | 'button' | 'checkbox' | 'file' | 'number' | 'radio';
  dictType?: string;
  colMultiple?: number;
};
